<template>
	<!-- 评论、纠错、笔记 -->
	<view v-if="show" class="comment-popup">
		<view class="popup-shadow"></view>
		<view class="popup-content">
			<view class="title">{{params.title}}</view>
			<view class="close" @tap="closeModal">取消</view>
			<textarea class="textarea" :adjust-position="true" :placeholder="params.placeholder" v-model="textareaVal" :maxlength="-1" auto-focus :confirm-type="params.btnText" />
			<view class="btns">
				<view class="btn" @click="submit">{{params.btnText}}</view>
			</view>
		</view>
	</view>
</template>

<script>
	import { addComment } from '@/api/index.js'
	export default {
		name:"commentPopup",
		props: {
			selection: {
				type: Number,
			}
		},
		computed: {
			SUBJECTBYDEPT() {
				return this.$store.state.SUBJECTBYDEPT;
			},
		},
		watch: {
			
		},
		data() {
			return {
				show: false,
				textareaVal: '',
				params: {
					title: '',
					placeholder: '',
					btnText: ''
				},
				type: '1',
				isAi: false,//是否是ai分析
				saveId: '',
			};
		},
		created(){
		},
		mounted(){
			console.log(this.type,'---49')
		},
		methods: {
			infoInit(){
				let params={}
				if(this.type=='1'){
					params={
						title: '写评论',
						placeholder: '请共同维护评论区友好、优质内容，恶意评论会被删除或封禁~笔记进来就是新建或编辑历史，题目纠错和评论每次都是新建',
						btnText: '提交'
					}
				}else if(this.type=='2'){
					params={
						title: '题目纠错',
						placeholder: '感谢您的宝贵意见，我们会第一时间查看、校队~',
						btnText: '提交'
					}
				}else if(this.type=='3'){
					params={
						title: '笔记',
						placeholder: '好记性不如烂笔头，快来写笔记吧~',
						btnText: '保存'
					}
				}
				this.params=params
			},
			openModal(type,isAi,OldVal='') {
			    this.show = true;
				this.type=type;
				this.isAi=isAi;
				this.textareaVal=OldVal;
				this.infoInit();
			},
			closeModal() {
			    this.show = false;
			    this.$emit('close'); // 触发关闭事件
			},
			setTextValue(text,saveId){
				console.log(text,saveId,'[-=-833]')
				this.saveId=saveId;
				setTimeout(()=>{
					this.textareaVal+=text
				},0)
			},
			submit(){
				if(this.$common.isEmpty(this.textareaVal)){
					return uni.showToast({title: '内容不能为空',icon: 'none'});
				}
				if(['1','2','3'].includes(this.type)){
					console.log(this.saveId,'----this.saveId')
					console.log(this.SUBJECTBYDEPT,'----this.SUBJECTBYDEPT')
					console.log(this.selection,'----this.selection')
					addComment({
						sid: this.saveId || this.SUBJECTBYDEPT[this.selection].id,
						type: this.type=='1' ? 1 : this.type=='2' ? 3 : 2,//类型：1-评论，2-笔记  3纠错
						content: this.textareaVal,
						ntype: this.isAi ? 2 : 1,//笔记类型：1-题笔记，2-AI分析笔记
					}).then(res=>{
						this.textareaVal='';
						this.$emit('addSuccess');
						uni.showToast({title: this.type=='1' ? '评价成功' : this.type=='2' ? '题目纠错已提交' : '笔记添加成功',icon: 'none'});
						this.closeModal();
					})
				}
			},
		},
		beforeDestroy(){
			
		}
	}
</script>

<style lang="scss" scoped>
	.comment-popup{
		position: fixed;
		z-index: 111;
	}
	.comment-popup,.popup-shadow{
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
	}
	.popup-shadow{
		background-color: rgba(0, 0, 0, 0.4); /* 黑色半透明 */
		backdrop-filter: blur(4px); /* 背景模糊 4px */
	}
	.popup-shadow,.popup-content{
		position: absolute;
	}
	.popup-content{
		bottom: 0;
		left: 0;
		right: 0;
		padding: 0 28rpx 32rpx;
		border-radius: 24rpx 24rpx 0 0;
		background: linear-gradient( 90deg, #FEFDFD 0%, #F5F5F5 100%);
		.title{
			display: flex;
			justify-content: center;
			align-items: center;
			height: 90rpx;
			font-size: 28rpx;
			font-weight: 600;
			color: #222;
		}
		.close{
			position: absolute;
			top: 30rpx;
			right: 28rpx;
			cursor: pointer;
			font-size: 24rpx;
			color: #969696;
		}
		.textarea{
			width: auto;
			height: 484rpx;
			padding: 24rpx;
			margin-bottom: 42rpx;
			font-size: 24rpx;
			color: #333;
			border-radius: 12rpx;
			background-color: #fff;
			box-shadow: 0rpx 0rpx 24rpx 2rpx rgba(0,0,0,0.04);
		}
		.btns{
			display: flex;
			justify-content: flex-end;
		}
		.btn{
			width: 102rpx;
			height: 56rpx;
			line-height: 56rpx;
			text-align: center;
			border-radius: 8rpx;
			font-size: 26rpx;
			color: #fff;
			background-color: #FAB45B;
		}
	}
</style>